<template>
    <div id="box">

    </div>
</template>
<script>
import { getReports } from '../untils/api'
import * as echarts from 'echarts';


export default {
    data() {
        return {


        }

    },
    created() {
        getReports().then(res => {
            console.log(res);
            var chartDom = document.getElementById('box');
            var myChart = echarts.init(chartDom);
            var option;

            option = {
                title: {
                    text: '用户来源'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                        type: 'cross',
                        label: {
                            backgroundColor: '#6a7985'
                        }
                    }
                },
                legend: {
                    data: res.data.data.legend.data
                },
                toolbox: {
                    feature: {
                        saveAsImage: {}
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis:res.data.data.xAxis,
                // xAxis: [
                //     // {
                //     //     type: 'category',
                //     //     boundaryGap: false,
                //     //     data: 
                //     // }
                // ],
                yAxis: [
                    {
                        type: res.data.data.yAxis[0].type
                    }
                ],
                series: res.data.data.series
                    // {
                    //     name: res.data.data.series.data.name,
                    //     type: res.data.data.series.data.type,
                    //     stack: res.data.data.series.data.stack,
                    //     areaStyle: {},
                    //     emphasis: {
                    //         focus: 'series'
                    //     },
                    //     data:res.data.data.series.data
                    // },
                    
            }
            
            option && myChart.setOption(option);
        })
    }
}
</script>
<style lang="scss" scoped>
#box{
    width: 100%;
    height: 100%;
}
</style>


